﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>个人中心</title>
     <th:block th:include="include :: front-common-css-js" />  
    <style>

        .contact { }
        .contact .con { position: relative; margin-top: 80px; }
        .contact .con .ditu img { display: block; border-radius: 20px; }
        .contact .con .font { position: absolute; top: 45px; right: 160px; background: #fff; padding: 40px; }
        .contact .con .font .p1 { font-size: 18px; color: #ec8718; padding-bottom: 26px; }
        .contact .con .font .lx { padding-bottom: 27px; margin-bottom: 30px; border-bottom: 1px solid #e5e5e5; }
        .contact .con .font .p2 .s1 { display: block; line-height: 30px; }

        @media (max-width: 1024px) {
            .contact .con .font { position: unset; }
        }
        
        table {  width:80%;border-collapse:collapse;}
        table,th,td{border: 1px solid black;pading:5px;}
        th{text-align:center;}
		td { height:50px; text-align:left;}
		
    </style>

</head>
<body>
    <!--主体内容 end-->
    <th:block th:include="include :: front-header" /> 
    <!--主体内容-->

   <div style="margin-left:30px;font-size: 1.3rem;">
   	<!-- <a href=""><div style="height: 30px;margin-top: 10px;"><p>钱包</p></div></a> 
    <span class="line" style="width: 80%; height: 1.3px; background: #029F45; display: inline-block;"></span> -->  	
   	<a href="" class="showInfo"><div style="height: 30px;margin-top: 10px;"><p>已课程报名</p></div></a>
   	<div id="course">
   	     <table>
   	     	<tr>
   	     		<th>序号</th>
   	     		<th>课程名称</th>
   	     		<th>报名时间</th>
   	     	</tr>   	     	
   	     	<tr th:each="course : ${courses}">
   	     		<td th:text="${courseStat.count}">1</td>
   	     		<td th:text="${course.courseName}">积木教程</td>
   	     		
   	     		<td th:text="${#dates.format(course.applyTime, 'yyyy-MM-dd')}">2018-08-19</td>
   	     	</tr>
   	     </table>
   	</div>
   	<span class="line" style="width: 80%; height: 1.3px; background: #029F45; display: inline-block;"></span> 
   	<a href="" class="showInfo"><div style="height: 30px;margin-top: 10px;"><p>预约管理</p></div></a>
   	<div id="appoint">
   	      <table>
   	      	<tr>
   	      		<th>序号</th>
   	      		<th>课程名称</th>
   	      		<th>预约时间</th>
   	      		<th>上课时间</th>
   	      		<th>操作</th>
   	      	</tr>
   	      	<tr th:each="app :${appointments}">
   	      		<td th:text="${appStat.count}">1</td>
   	      		<td th:text="${app.courseName}">魔方教程</td>   	      		
   	      		<td th:text="${#dates.format(app.createTime, 'yyyy-MM-dd')}">2018-10-10</td>
   	      		<td th:text="${#dates.format(app.courseTime, 'yyyy-MM-dd')}">2018-10-12</td>
   	      		<td><a th:href="@{/front/self/cancel(id=${app.id})}">取消</a></td>
   	      	</tr>
   	      </table>
   	</div>
   	<span class="line" style="width: 80%; height: 1.3px; background: #029F45; display: inline-block;"></span> 
   	<a href="/front/self/updateStudent"><div style="height: 30px;margin-top: 10px;"><p>修改个人信息</p></div></a>
   	<span class="line" style="width: 80%; height: 1.3px; background: #029F45; display: inline-block;"></span> 
   	<a href="" class="showInfo"><div style="height: 30px;margin-top: 10px;"><p>修改密码</p></div></a>
   	<div id="showPass">
   	     <form action="/front/self/updatePass" method="post">
   	         <table>
   	         	<tr>
   	         		<td>旧密码:</td>
   	         		<td> <input type="password" name="oldPassword" required /> </td>
   	         	</tr>
   	         	<tr>
   	         		<td>新密码:</td>
   	         		<td><input type="password" name="newPassword" required /> </td>
   	         	</tr>
   	         	<tr>
   	         		<td></td>
   	         		<td><input type="submit" value="修改密码" />
   	         		    <input type="reset" value="重置" />
   	         		</td>
   	         	</tr>
   	         </table>
   	     </form>
   	</div>
   	<span class="line" style="width: 80%; height: 1.3px; background: #029F45; display: inline-block;"></span> 
   	<a href="/front/loginOut"><div style="height: 30px;margin-top: 10px;"><p>退出登陆</p></div></a>   	
   </div>
   
 <!--主体内容 end-->
 <th:block th:include="include:: front-footer" />
 <script>
    $(function(){    	
    	$(".showInfo + div").hide();
    	$(".showInfo").click(function(e){
    		e.preventDefault();
    		$(this).next().toggle();    		
    		
    	});
    });       
 </script>
</body>
</html>

